import { useState } from "react";
import Card from "../UI/Card";

const LogsForm = (props) => {
    // const [date, setDate] = useState(new Date());
    // const [tit, setTit] = useState();
    // const [content, setContent] = useState();
    const [formData, setFormData] = useState({
        data: "",
        title: "",
        content: "",
    })

    const changeDate = (e) => {
        setFormData({ ...formData, data: new Date(e.target.value) });
    }
    const changeDate2 = (e) => {
        setFormData({ ...formData, title: e.target.value });
    }
    const changeDate3 = (e) => {
        setFormData({ ...formData, content: e.target.value });
    }

    const submitHandle = (e) => {
        e.preventDefault();
        props.save(formData)
        setFormData({
            date: new Date(),
            tit: "",
            content: "",
        })
        // setDate('');
        // setTit('');
        // setContent('');
    }
    return (
        <Card>
            <form onSubmit={submitHandle}>
                <label htmlFor="date">日期</label>
                <input id="date" onChange={changeDate} type="date" value={formData.data} />
                <label htmlFor="tit">标题</label>
                <input id="tit" onChange={changeDate2} type="text" value={formData.title} />
                <label htmlFor="content">内容</label>
                <input id="content" onChange={changeDate3} value={formData.content} type="text" />
                <button>提交</button>
            </form>
        </Card>
    )
}

export default LogsForm;